<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org" xmlns:fmt="http://java.sun.com/jsp/jstl/fmt" xmlns:c="http://www.w3.org/1999/XSL/Transform">
<head>
    <meta charset="UTF-8">
    <title>MyPetStore</title>
    <link rel="Stylesheet" href="../css/jpetstore.css" type="text/css" media="screen"/>
</head>

<body>

<div th:replace="common/top">
</div>

<div id="Content">
    <div id="BackLink">
        <a href="/catalog/main">Return to Main Menu</a>
    </div>
    <div id="Catalog">


        <table>
            <tr>
                <th align="center" colspan="2">
                    Order <span th:text="'#'+${session.order.orderId}+'    '+${#dates.format(session.order.orderDate,'yyyy/MM/dd')}">
                </span>
<!--                    <fmt:formatDate th:text="${#dates.format(session.order.orderDate,'yyyy/MM/dd')}" />-->
                </th>
            </tr>
            <tr>
                <th colspan="2">Payment Details</th>
            </tr>
            <tr>
                <td>Card Type:</td>
<!--                <c:out th:value="${order.cardType}" />-->
                <td th:text="${session.order.cardType}"></td>
            </tr>
            <tr>
                <td>Card Number:</td>
<!--                <td><c:out value="${sessionScope.order.creditCard}" /> * Fake number!</td>-->
                <td th:text="${session.order.creditCard}"></td>
            </tr>
            <tr>
                <td>Expiry Date (MM/YYYY):</td>
<!--                <td><c:out value="${sessionScope.order.expiryDate}" /></td>-->
                <td th:text="${session.order.expiryDate}"></td>
            </tr>
            <tr>
                <th colspan="2">Billing Address</th>
            </tr>
            <tr>
                <td>First name:</td>
                <td th:text="${session.order.billToFirstName}"></td>
<!--                <td><c:out value="${sessionScope.order.billToFirstName}" /></td>-->
            </tr>
            <tr>
                <td>Last name:</td>
                <td th:text="${session.order.billToLastName}"></td>
<!--                <td><c:out value="${sessionScope.order.billToLastName}" /></td>-->
            </tr>
            <tr>
                <td>Address 1:</td>
                <td th:text="${session.order.billAddress1}"></td>
<!--                <td><c:out value="${sessionScope.order.billAddress1}" /></td>-->
            </tr>
            <tr>
                <td>Address 2:</td>
                <td th:text="${session.order.billAddress2}"></td>
<!--                <td><c:out value="${sessionScope.order.billAddress2}" /></td>-->
            </tr>
            <tr>
                <td>City:</td>
                <td th:text="${session.order.billCity}"></td>
<!--                <td><c:out value="${sessionScope.order.billCity}" /></td>-->
            </tr>
            <tr>
                <td>State:</td>
                <td th:text="${session.order.billState}"></td>
<!--                <td><c:out value="${sessionScope.order.billState}" /></td>-->
            </tr>
            <tr>
                <td>Zip:</td>
                <td th:text="${session.order.billZip}"></td>
<!--                <td><c:out value="${sessionScope.order.billZip}" /></td>-->
            </tr>
            <tr>
                <td>Country:</td>
                <td th:text="${session.order.billCountry}"></td>
<!--                <td><c:out value="${sessionScope.order.billCountry}" /></td>-->
            </tr>
            <tr>
                <th colspan="2">Shipping Address</th>
            </tr>
            <tr>
                <td>First name:</td>
                <td th:text="${session.order.shipToFirstName}"></td>
<!--                <td><c:out value="${sessionScope.order.shipToFirstName}" /></td>-->
            </tr>
            <tr>
                <td>Last name:</td>
                <td th:text="${session.order.shipToLastName}"></td>
<!--                <td><c:out value="${sessionScope.order.shipToLastName}" /></td>-->
            </tr>
            <tr>
                <td>Address 1:</td>
                <td th:text="${session.order.shipAddress1}"></td>
<!--                <td><c:out value="${sessionScope.order.shipAddress1}" /></td>-->
            </tr>
            <tr>
                <td>Address 2:</td>
                <td th:text="${session.order.shipAddress2}"></td>
<!--                <td><c:out value="${sessionScope.order.shipAddress2}" /></td>-->
            </tr>
            <tr>
                <td>City:</td>
                <td th:text="${session.order.shipCity}"></td>
<!--                <td><c:out value="${sessionScope.order.shipCity}" /></td>-->
            </tr>
            <tr>
                <td>State:</td>
                <td th:text="${session.order.shipState}"></td>
<!--                <td><c:out value="${sessionScope.order.shipState}" /></td>-->
            </tr>
            <tr>
                <td>Zip:</td>
                <td th:text="${session.order.shipZip}"></td>
<!--                <td><c:out value="${sessionScope.order.shipZip}" /></td>-->
            </tr>
            <tr>
                <td>Country:</td>
                <td th:text="${session.order.shipCountry}"></td>
<!--                <td><c:out value="${sessionScope.order.shipCountry}" /></td>-->
            </tr>
            <tr>
                <td>Courier:</td>
                <td th:text="${session.order.courier}"></td>
<!--                <td><c:out value="${sessionScope.order.courier}" /></td>-->
            </tr>
            <tr>
                <td>Status: </td>
<!--                <c:out value="${sessionScope.order.status}" />-->
                <td th:text="${session.order.status}"></td>
            </tr>
            <tr>
                <td colspan="2">
                    <table>
                        <tr>
                            <th>Item ID</th>
                            <th>Description</th>
                            <th>Quantity</th>
                            <th>Price</th>
<!--                            <th>Total Cost</th>-->
                        </tr>
<!--                        <c:forEach var="lineItem" items="${sessionScope.order.lineItems}">-->
                            <tr th:each="lineItem:${session.order.lineItems}">
                                <td>
                                    <a th:href="@{'/catalog/item?itemId='+${lineItem.item.itemId}}" th:text="${lineItem.item.itemId}"></a>
                                </td>
                                <td th:if="${lineItem.item != null}" th:text="${lineItem.item.attribute1!=null?lineItem.item.attribute1:''}+' '+${lineItem.item.attribute2!=null?lineItem.item.attribute2:''}+' '+${lineItem.item.attribute3!=null?lineItem.item.attribute3:''}+' '+${lineItem.item.attribute4!=null?lineItem.item.attribute4:''}+' '+${lineItem.item.attribute5!=null?lineItem.item.attribute5:''}+' '+${lineItem.item.product.name}">
<!--                                    <c:if test="${lineItem.item != null}">-->
                                </td>
                                <td th:if="${lineItem.item == null}">
<!--                                </c:if>-->
                                    <i>{description unavailable}</i>
                                </td>

                                <td th:text="${lineItem.quantity}"></td>
<!--                                th:text="${'$'+#numbers.formatDecimal(order.totalPrice,0,'COMMA',2,'POINT')}"-->
                                <td><fmt:formatNumber th:text="${'$'+#numbers.formatDecimal(lineItem.unitPrice,0,'COMMA',2,'POINT')}" /></td>
<!--                                <td><fmt:formatNumber th:text="${'$'+#numbers.formatDecimal(lineItem.total,0,'COMMA',2,'POINT')}" /></td>-->
                            </tr>
<!--                        </c:forEach>-->
                        <tr>
                            <th colspan="5">
                                Total: <fmt:formatNumber th:text="${'$'+#numbers.formatDecimal(session.order.totalPrice,0,'COMMA',2,'POINT')}" />
                            </th>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
    </div>
</div>

<div th:replace="common/bottom"></div>
</body>

</html>